<!--
 * @Description: 
 * @Author: charles
 * @Date: 2021-05-05 22:02:56
 * @LastEditors: tianhao
 * @LastEditTime: 2022-01-10 16:52:05
-->
<template>

  <div ref="right1_container" style="height:95%"></div>

</template>

<script>

import {Pie} from '@antv/g2plot'

export default {
data(){
  return{
 dataArr:[{ type: '累计确诊', value: 134035 },
  { type: '境外输入', value: 11688   },
  { type: '累计治愈', value: 121839 },
  { type: '累计死亡', value: 5699 },
]
  }
},
 mounted(){
this.initChart()
  },
  methods:{
initChart(){
  const pie = new Pie(this.$refs.right1_container,{
  appendPadding: 10,
  data:this.dataArr,
  angleField: 'value',
  colorField: 'type',
  radius: 0.8,
  label: {
    type: 'outer',
    content: '{name} {percentage}',
  },
  interactions: [{ type: 'pie-legend-active' }, { type: 'element-active' }],
});

  pie.render()
}

  }
}
   
</script>

<style scoped>

</style>


